{include file="/public/header"}
<style>
    .mask{position:fixed;width:100%;height:100%;top:0;left:0;background:#000;opacity:0.8;filter:alpha(Opacity=80);-moz-opacity:0.8;z-index:999;display:none;}
    .loading{position:fixed;width:300px;left:50%;margin-left:-150px;top:200px;height:18px;border-radius:10px;background:#fff;z-index:9999;overflow:hidden;display:none;}
</style>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form formBasForm">
                <input type="hidden" id="totalPage" value="0"/>
                <input type="hidden" id="page" value="1"/>
                <input type="hidden" id="status" value="0"/>
                <input type="hidden" name="filename" value=""/>
                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">加密类型:</label>
                    <div class="layui-input-block">
                        <select id="type" name="type" class="layui-input ew-select-fixed" lay-filter="type" lay-search>
                            <option value="">请选择加密类型</option>
                        </select>
                    </div>
                </div>
                
                <div id="introduceDisplay" style="display:none">
                    <div class="layui-form-item">
                        <div class="sf-tips">
                            <div id="introduce"></div>
                        </div>
                    </div>
                </div>       
                
                <div id="versionSelection" style="display:none">
                    <div class="layui-form-item">
                        <label class="layui-form-label layui-form-required">PHP版本:</label>
                        <div class="layui-input-block">
                              <input type="checkbox" name="version[]" value="5.4" title="PHP 5.4">
                              <input type="checkbox" name="version[]" value="5.5" title="PHP 5.5">
                              <input type="checkbox" name="version[]" value="5.6" title="PHP 5.6">
                              <input type="checkbox" name="version[]" value="7.0" title="PHP 7.0">
                              <input type="checkbox" name="version[]" value="7.1" title="PHP 7.1">
                              <input type="checkbox" name="version[]" value="7.2" title="PHP 7.2">
                              <input type="checkbox" name="version[]" value="7.3" title="PHP 7.3">
                              <input type="checkbox" name="version[]" value="7.4" title="PHP 7.4">
                              <input type="checkbox" name="version[]" value="8.0" title="PHP 8.0">
                              <input type="checkbox" name="version[]" value="8.1" title="PHP 8.1">
                        </div>
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label layui-form-required">版权信息</label>
                    <div class="layui-input-block">
                        <textarea name="comment" class="layui-textarea" style="height:100px" placeholder="例如：SF版权所有"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">上传文件:</label>
                    <div class="layui-input-block">
                        <div class="layui-upload-drag" id="fileUpload">
                            <i class="layui-icon layui-icon-upload-drag" style="color:#2d8cf0;"></i>
                            <p>点击上传，或将文件拖拽到此处</p>
                            <div class="layui-hide" id="uploadDemoView">
                                <hr>
                                <div class="layui-form-item">
                                    <img src="" alt="上传成功后渲染" id="demo1" style="max-width: 196px">
                                </div>
                                <div class="layui-form-item">
                                    <label class="layui-form-label">文件名</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="name" id="name" value="" lay-verify="title" autocomplete="off" readonly="true" class="layui-input">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="mask"></div>
                <div class="loading">
                    <div class="layui-progress layui-progress-big" lay-showpercent="true" lay-filter="uploadProgress">
                        <div class="layui-progress-bar" lay-percent="0%"></div>
                    </div>
                </div>
                <div class="layui-form-item text-right">
                    <button class="layui-btn" lay-filter="SF_EditSubmit" lay-submit>开始</button>
                    <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">重置</button>
                </div>
                <div class="layui-form-item">
                    <div class="sf-tips">
                        选择加密类型，上传需要加密的文件压缩包即可加密
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
{include file="/public/footer"}
<script>
    layui.use(['layer', 'form', 'admin', 'notice' ,'upload', 'element'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var admin = layui.admin;
        var notice = layui.notice;
        var upload = layui.upload;
        var element = layui.element;

        $(function (){
            notice.msg('正在执行中...', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:addons_url("Encryption/list")}',
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    var content = '<option value="">请选择加密类型</option>';
                    $.each(data,function(index, value){
                        content += '<option value="'+index+'" versionSelection="'+value.versionSelection+'" introduce="'+value.introduce+'">'+value.name+'</option>';
                    });
                    $("#type").html(content);
                    form.render('select');
                    notice.msg(data.msg, {icon: 1, audio:'1'});
                
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
        });

        upload.render({
            elem: '#fileUpload',
            url: '{:url("/Upload/temp")}', //处理上传文件接口
            accept: 'file',
            auto: false,
            acceptMime: '*.*',//允许上传的文件类型
            choose: function (obj) {
                element.progress('uploadProgress', '0%');
                $('.mask').show();
                $('.loading').show();
                var data = this.data;
                var files = obj.pushFile();
                var LENGTH = 500 * 1024; //每片文件大小
                obj.preview(function (index, file, result) {
                    var totalSize = file.size;
                    var totalPage = Math.ceil(totalSize / LENGTH);
                    $('#totalPage').val(totalPage);
                    $('#page').val('1');
                    $('#status').val('1');
                    var fileName = file.name;
                    $('#name').val(fileName);
                    var fileExt = fileName.substr(fileName.lastIndexOf('.') + 1);
                    fileName = fileName.substr(0, fileName.lastIndexOf('.'));
                    var progressTimer = setInterval(function () {
                        var totalPage = parseInt($('#totalPage').val());
                        var page = parseInt($('#page').val());
                        var status = $('#status').val();
                        if (parseInt(totalPage) == parseInt(page) && (parseInt(status) == 2 || parseInt(status) == -1)) {
                            clearInterval(progressTimer);
                        } else {
                            if (status == 1) {
                                $('#status').val('0');
                                data.fileName = fileName;
                                data.page = page;
                                data.totalPage = totalPage;
                                data.fileExt = fileExt;
                                obj.upload(index, file.slice((page - 1) * LENGTH, page * LENGTH));
                            }
                        }
                    }, 100);
                });
            },
            done: function (res) {
                if(res.code == 0) {
                    if (res.data.status == 1) { //分片上传
                        var page = parseInt($('#page').val());
                        var totalPage = parseInt($('#totalPage').val());
                        element.progress('uploadProgress', Math.ceil(page * 100 / totalPage) + '%');
                        page = page + 1;
                        console.log(page);
                        $('#page').val(page);
                        $('#status').val('1');
                    } else if (res.data.status == 2) { //上传完成
                        element.progress('uploadProgress', '100%');
                        $('#status').val('2');
                        layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', '{__MODULE__}fileChoose/img/zip.png');
                        notice.msg('上传成功', {icon: 1,audio: '1',onOpening: function () {
                                $('.mask').hide();
                                $('.loading').hide();}
                        });
                    } else { //上传错误
                        $('#status').val('-1');
                        element.progress('uploadProgress', '0%');
                        console.log(!typeof (res.data.downUrl) == "undefined");
                        if (typeof (res.data.downUrl) == "undefined") {
                        } else {
                            $('#downUrl').val(res.data.downUrl);
                        }
                        notice.msg(res.msg, {icon: 2,audio: '1',onOpening: function () {
                                $('.mask').hide();
                                $('.loading').hide();}
                        });
                    }
                }else{
                    $('#status').val('-1');
                    element.progress('uploadProgress', '0%');
                    console.log(!typeof (res.data.downUrl) == "undefined");
                    if (typeof (res.data.downUrl) == "undefined") {
                    } else {
                        $('#downUrl').val(res.data.downUrl);
                    }
                    notice.msg(res.msg, {icon: 2,audio: '1',onOpening: function () {
                            $('.mask').hide();
                            $('.loading').hide();}
                    });
                }
            },
            error: function(){
                notice.msg('服务器错误', {icon: 2,audio: '1',onOpening: function () {
                        $('.mask').hide();
                        $('.loading').hide();}
                });
            }
        });

        form.on('select(type)', function (data) {
            let versionSelection = $("#type option:selected").attr('versionSelection');
            let introduce = $("#type option:selected").attr('introduce');
            if (versionSelection == '1') {
                $("#versionSelection").css("display", "inherit");
            }else{
                $("#versionSelection").css("display", "none");
            }
            
            if(data.value == ''){
                $("#introduceDisplay").css("display", "none");
            }else{
                $("#introduceDisplay").css("display", "inherit");
                $("#introduce").html(introduce);
            }
        });
        
        form.on('submit(SF_EditSubmit)', function (data) {
            notice.msg('正在执行中...', {icon: 4, close: true});
            $.ajax({
                type: "POST",
                url: '{:addons_url("Encryption/index")}',
                data: data.field,
                dataType: "json",
                success: function(data) {
                    notice.destroy();
                    if (data.code == 0) {
                        notice.msg(data.msg, {icon: 1, audio:'1'});
                        layui.$('#uploadDemoView').addClass('layui-hide');
                        parent.layui.admin.confirm('确认要下载文件'+data.data+'吗？', {icon:3}, function (index) {
                            window.open('{:addons_url("Encryption/download")}?name='+data.data);
                            parent.layer.close(index);
                        });
                    } else {
                        notice.msg(data.msg, {icon: 2, audio:'1'});
                    }
                },
                error: function() {
                    notice.destroy();
                    notice.msg("服务器错误！", {icon: 2, audio:'1'});
                }
            });
            return false;
        });

    });
</script>